<template>
  <div class="my_order">
    <van-cell class="order_cell" value="全部订单" @click="all_order" is-link>
      <template #title>
        <span class="custom-title" @click="order_fn">我的订单</span>
      </template>
    </van-cell>
    <van-row class="class1" type="flex" justify="space-between">
      <van-col span="4">
        <van-icon name="idcard" size="30" badge="99+" />
        <div>待付款</div>
      </van-col>
      <van-col span="4">
        <van-icon name="logistics" size="30" />
        <div>待收货</div>
      </van-col>
      <van-col span="4">
        <van-icon name="underway-o" size="30" />
        <div>待使用</div>
      </van-col>
      <van-col span="4">
        <van-icon name="comment-o" size="30" />
        <div>待评价</div>
      </van-col>
      <van-col span="4">
        <van-icon name="refund-o" size="30" />
        <div>退款/售后</div>
      </van-col>
    </van-row>
  </div>
</template>

<script>
import { Toast } from 'vant';
export default {
  name: "user_middle",
  data() {
    return {
      
    };
  },
  methods: {
    all_order() {
      if (localStorage.getItem("waimai")) {
        this.$router.push("/order")
      } else {
        Toast("请先登录")
      }
    },
    order_fn(){
      this.$router.push({name: "order"})
    }
  },
};
</script>

<style scoped>
.order_cell,
.class1 {
  width: 95%;
  margin: auto;
}

.van-col {
  font-size: 12px;
  /* border: 1px solid blue; */
  border-radius: 5px;
  text-align: center;
  line-height: 20px;
  margin-top: 7px;
}
.my_order {
  width: 95%;
  height: 100px;
  margin: 15px auto;
  padding-top: 10px;
  background-color: white;
  border-radius: 5px;
}
.van-icon,
.van-cell {
  padding: 0px;
  line-height: 30px;
}
</style>